// 折线图默认配置
const lineOptions = {
  grid: {
    left: '6%',
    right: '20%',
    top: '10%',
    bottom: '10%'
  },
  tooltip: {
    trigger: 'axis' // 设置提示框触发类型为axis
  },
  xAxis: {
    type: 'category', // x轴设置为类目轴
    splitArea: {
      show: true,
      areaStyle: {
        color: ['rgba(40, 56, 83, 0.8)']
      }
    },
    axisLine: {
      lineStyle: {
        color: '#fff'
      }
    },
    data: []
  },
  yAxis: {
    type: 'value', // y轴设置为数值轴
    axisLabel: {
      show: false
    },
    splitLine: {
      show: false
    }
  },
  series: [
    {
      itemStyle: {
        normal: {
          label: {
            show: true,
            color: '#949FB6',
            position: 'bottom'
          },
          color: '#18E8E6', // #1776D4
          borderColor: '#1776D4', // 拐点边框颜色
          borderWidth: 30,
          lineStyle: {
            color: '#949FB6',
            width: 1
          }
        },
        emphasis: {
          color: '#18E8E6',
          borderColor: '#267AC6',
          borderWidth: 30
        }
      },
      data: [],
      type: 'line', // 设置图表的类型为折线图
      symbol: 'emptyCircle',
      symbolSize: 6
    }
  ]
}

// 重点人员饼图默认配置
const zdryPieOptions = {
  color: ['#0498F9', '#0CD9B4', '#3B72AD', '#FDCD00', '#F37427'], // 设置饼图的默认颜色
  title: [{
    text: '总人数', // 饼图的标题
    textAlign: 'center',
    subtext: '0', // 饼图的副标题
    textStyle: {
      fontSize: 12, // 设置饼图标题样式
      color: '#999'
    },
    subtextStyle: {
      fontSize: 20, // 设置饼图副标题样式
      color: '#fff'
    },
    top: '38%', // top居中
    left: '28%' // left居中
  }
  ],
  tooltip: {
    trigger: 'item' // 设置提示框触发类型为item
  },
  legend: {
    orient: 'vertical', // 设置图例排列方式为垂直
    align: 'left',
    right: '14%',
    top: 'middle',
    itemGap: 14, // 图例间距20
    icon: 'circle', // 图例的样式为圆角
    itemWidth: 8,
    textStyle: {
      color: '#fff'
    },
    itemStyle: {
      borderColor: 'transparent',
      borderWidth: 0
    },
    formatter: function (name: any) {
      const temp = zdryPieOptions.series[0].data
      let tarValue
      for (let i = 0; i < temp.length; i++) {
        if (temp[i].name === name) {
          tarValue = temp[i].value
        }
      }
      return `${name}   ${tarValue}`
      // name是名称，v是数值
    }
  },
  series: [
    {
      name: '类别占比',
      type: 'pie', // 图表类型为饼图
      radius: ['50%', '80%'],
      center: ['30%', '50%'],
      avoidLabelOverlap: false,
      itemStyle: {
        borderColor: '#fff',
        borderWidth: 0
      },
      label: {
        show: true,
        color: '#fff',
        fontSize: '8px',
        position: 'inside',
        formatter: '{d}%'
      },
      labelLine: {
        show: false
      },
      data: [
        {
          value: null,
          name: ''
        }
      ]
    }
  ]
}
// 娱乐特行饼图默认配置
const yltxPieOptions = {
  color: ['#0498F9', '#0CD9B4', '#3B72AD', '#FDCD00', '#F37427'], // 设置饼图的默认颜色
  title: [{
    text: '总人数', // 饼图的标题
    textAlign: 'center',
    subtext: '0', // 饼图的副标题
    textStyle: {
      fontSize: 12, // 设置饼图标题样式
      color: '#999'
    },
    subtextStyle: {
      fontSize: 20, // 设置饼图副标题样式
      color: '#fff'
    },
    top: '38%', // top居中
    left: '28%' // left居中
  }
  ],
  tooltip: {
    trigger: 'item' // 设置提示框触发类型为item
  },
  legend: {
    orient: 'vertical', // 设置图例排列方式为垂直
    align: 'left',
    right: '14%',
    top: 'middle',
    itemGap: 14, // 图例间距20
    icon: 'circle', // 图例的样式为圆角
    itemWidth: 8,
    textStyle: {
      color: '#fff'
    },
    itemStyle: {
      borderColor: 'transparent',
      borderWidth: 0
    },
    formatter: function (name: any) {
      const temp = yltxPieOptions.series[0].data
      let tarValue
      for (let i = 0; i < temp.length; i++) {
        if (temp[i].name === name) {
          tarValue = temp[i].value
        }
      }
      return `${name}   ${tarValue}`
      // name是名称，v是数值
    }
  },
  series: [
    {
      name: '类别占比',
      type: 'pie', // 图表类型为饼图
      radius: ['50%', '80%'],
      center: ['30%', '50%'],
      avoidLabelOverlap: false,
      itemStyle: {
        borderColor: '#fff',
        borderWidth: 0
      },
      label: {
        show: true,
        color: '#fff',
        fontSize: '8px',
        position: 'inside',
        formatter: '{d}%'
      },
      labelLine: {
        show: false
      },
      data: [
        {
          value: null,
          name: ''
        }
      ]
    }
  ]
}

// 柱状图默认配置
const itemStyle = {
  normal: {
    label: {
      show: true,
      position: 'top',
      textStyle: {
        color: '#fff',
        fontSize: 10
      }
    }
  }
}
const barOptions = {
  title: {
    text: '' // 设置柱状图默认标题
  },
  grid: {
    left: '10%',
    right: '20%',
    top: '30%',
    bottom: '10%'
  },
  color: ['#0498F9', '#0CD9B4', '#3B72AD', '#E4A33F'],
  legend: {
    orient: 'horizontal',
    align: 'left',
    top: '6%',
    show: true,
    icon: 'rect',
    itemWidth: 10,
    itemHeight: 10,
    data: ['活动举办次数', '参加人数', '案件', '警情'],
    textStyle: {
      color: '#fff'
    }
  },
  tooltip: {
    trigger: 'axis' // 设置提示框触发类型为axis
  },
  xAxis: {
    type: 'category',
    data: ['活动庆典', '艺术娱乐活动', '会展及商贸活动', '体育赛事'],
    axisLine: {
      lineStyle: {
        color: '#fff'
      }
    }
  },
  yAxis: {
    type: 'value',
    name: '单位:次数',
    splitLine: {
      show: true,
      lineStyle: {
        type: 'dotted'
      }
    }
  },
  series: [
    {
      name: '活动举办次数',
      barMaxWidth: 30, // 设置柱状图最大宽度为30
      barGap: 0,
      data: [],
      type: 'bar',
      itemStyle: itemStyle
    },
    {
      name: '参加人数',
      barMaxWidth: 30, // 设置柱状图最大宽度为30
      barGap: 0,
      data: [],
      type: 'bar',
      itemStyle: itemStyle
    },
    {
      name: '案件',
      barMaxWidth: 30, // 设置柱状图最大宽度为30
      barGap: 0,
      data: [],
      type: 'bar',
      itemStyle: itemStyle
    },
    {
      name: '警情',
      barMaxWidth: 30, // 设置柱状图最大宽度为30
      barGap: 0,
      data: [],
      type: 'bar',
      itemStyle: itemStyle
    }
  ]
}
// 检查站复合柱状图默认配置
const jczCompoundBarOptions = {
  title: {
    text: '', // 标题
    subtext: '' // 副标题
  },
  legend: {
    orient: 'horizontal',
    align: 'left',
    top: '6%',
    show: true,
    icon: 'rect',
    itemWidth: 10,
    itemHeight: 10,
    data: [],
    textStyle: {
      color: '#fff'
    }
  },
  axisTick: { // 刻度
    show: false
  },
  axisLabel: { // 刻度标签
    color: '#808080',
    fontSize: 12,
    margin: 8, // 刻度标签与轴线之间的距离
    interval: 'auto' // x轴标签显示间隔，自动
  },
  axisLine: { // 轴线
    lineStyle: {
      color: '#c3c3c3',
      width: 0.5
    }
  },
  splitLine: { // 分割线
    show: false,
    interval: 'auto'
  },
  splitArea: { // 分割区域
    show: false,
    areaStyle: {}
  },
  grid: {
    left: '10%',
    right: '20%',
    top: '30%',
    bottom: '10%'
  },
  xAxis: {
    type: 'category'
  },
  yAxis: {
    type: 'value',
    minInterval: 100,
    nameGap: 8,
    axisLabel: {
      color: '#808080',
      fontSize: 10
      // formatter: (value) => {
      // return moneyFormatValue(value);
      // },
    },
    splitLine: {
      lineStyle: {
        type: 'dashed',
        color: '#ebebeb',
        width: 0.5
      }
    }
  },
  color: [
  ], // 柱状图颜色
  dataset: {
    source: [
      // 数据源
    ]
  },
  series: [
    // 图标列设置
  ],
  tooltip: {
    // 提示框组件
  }
}
// 实有人口复合柱状图默认配置
const syrkCompoundBarOptions = {
  title: {
    text: '', // 标题
    subtext: '' // 副标题
  },
  legend: {
    orient: 'horizontal',
    align: 'left',
    top: '6%',
    show: true,
    icon: 'rect',
    itemWidth: 10,
    itemHeight: 10,
    data: [],
    textStyle: {
      color: '#fff'
    }
  },
  axisTick: { // 刻度
    show: false
  },
  axisLabel: { // 刻度标签
    color: '#808080',
    fontSize: 12,
    margin: 8, // 刻度标签与轴线之间的距离
    interval: 'auto' // x轴标签显示间隔，自动
  },
  axisLine: { // 轴线
    lineStyle: {
      color: '#c3c3c3',
      width: 0.5
    }
  },
  splitLine: { // 分割线
    show: false,
    interval: 'auto'
  },
  splitArea: { // 分割区域
    show: false,
    areaStyle: {}
  },
  grid: {
    left: '10%',
    right: '20%',
    top: '30%',
    bottom: '10%'
  },
  xAxis: {
    type: 'category'
  },
  yAxis: {
    type: 'value',
    minInterval: 100,
    nameGap: 8,
    axisLabel: {
      color: '#808080',
      fontSize: 10
      // formatter: (value) => {
      // return moneyFormatValue(value);
      // },
    },
    splitLine: {
      lineStyle: {
        type: 'dashed',
        color: '#ebebeb',
        width: 0.5
      }
    }
  },
  color: [
  ], // 柱状图颜色
  dataset: {
    source: [
      // 数据源
    ]
  },
  series: [
    // 图标列设置
  ],
  tooltip: {
    // 提示框组件
  }
}
export {
  lineOptions,
  zdryPieOptions,
  yltxPieOptions,
  barOptions,
  jczCompoundBarOptions,
  syrkCompoundBarOptions
}
